<!--
Use: Add a button to toggle styles between light and dark css. e.g.
<input type="button" class="btn btn-mini" value="light/dark theme" id="togglestyle" />

And add this in _includes/footer.html or _includes/javascript.html, eg
{% include switch-styles.html %}

Alternate method: see switch-css.js
-->

<script type="text/javascript">
var plusmin = 1;
$(document).ready(function() {
  // when click on the element with id="togglestyle"
  $('#togglestyle').click(function(){
    plusmin *= -1;        // change the polarity of "plusmin" var
    var stl = plusmin>0 ? '{{ site.baseurl }}/assets/css/light.css' : '{{ site.baseurl }}/assets/css/dark.css';     // sets the css file, according to plusmin

    // change the css file of the tag with id="stl" and rel="stylesheet"
    $('#stl[rel=stylesheet]').attr('href', stl);
  });
});
</script>
